import React from "react";

import { Avatar, Icon, Tools } from "weaver-mobile";
import { Base64 } from "js-base64";
import Circle from "../../public/Circle";

const getLabel = Tools.getLabel; const getHomeTaskTemplate = () => {
    return {
        default: [{
            key: "col_1",
            render: (data) => {
                const { name, subject, begindate, enddate, finish, finishcolor, hrmicon, hrmname } = data;
                return (
                    <div className="template-list-wrapper">
                        <div className="template-content-fly">
                            <div className="template-title" dangerouslySetInnerHTML={{ __html: subject }} />
                            <div className="template-item">
                                <span className="template-item-text">{getLabel("28098", "项目名称") + "："}
                                    <span dangerouslySetInnerHTML={{ __html: name }} />
                                </span>
                            </div>
                            <div className="template-item">
                                <span className="template-item-text">{getLabel("22168", "计划开始日期") + "："}{begindate}</span>
                            </div>
                            <div className="template-item">
                                <span className="template-item-text">{getLabel("22170", "计划结束日期") + "："}{enddate}</span>
                            </div>
                        </div>
                        <div className="template-avatar-box-fly">
                            <Avatar className="template-avatar"
                                name={hrmname}
                                url={hrmicon} />
                        </div>
                        <div className="template-circle-box-fly">
                            <Circle
                                current={parseFloat(finish) / 100}
                                progressColor={finishcolor}
                                startPoint={0}
                                size={49}
                                radius={22}
                                strokeWidth={5}
                                gradientDirection={"horizontal"}
                                linecap={"round"}
                            />
                        </div>
                    </div>

                );
            },
        }],
    };
}

const getPrjChildTaskListTemplate = () => {
    return {
        default: [{
            key: "col_1",
            render: (data) => {
                const { subjectspan, stagenamespan, stagename, begindatespan, enddatespan, finish, overstrspan, hrmidspan, childtaskspan, finishcolorspan, islandmarkspan } = data;
                return (
                    <div className="template-list-wrapper">
                        <div className="t-t-circle-box-fly">
                            <Circle
                                current={parseFloat(finish || 0) / 100}
                                progressColor={finishcolorspan || "#009"}
                                startPoint={0}
                                size={49}
                                radius={22}
                                strokeWidth={5}
                                gradientDirection={"horizontal"}
                                linecap={"round"}
                            />
                        </div>
                        <div className="t-t-content-fly">
                            <div className="template-title">
                                <span dangerouslySetInnerHTML={{ __html: subjectspan }} />
                                {islandmarkspan === "1" ?
                                    <i className="flag-tags-icon icon-proj icon-flag1196069easyiconnet" />
                                    : null
                                }
                            </div>
                            <div className="t-t-template-item">
                                <span className="template-item-text">{getLabel("24902", "阶段") + "："}{stagenamespan || stagename}</span>
                            </div>
                            <div className="t-t-template-item">
                                <span className="template-item-text">{getLabel("500805", "计划开始") + "/" + getLabel("24980", "结束日期") + "："}
                                    {begindatespan}&nbsp;{begindatespan && enddatespan ? <span>/</span> : null}&nbsp;{enddatespan}
                                </span>
                            </div>
                            <div className="t-t-template-item">
                                <span className="template-item-text"
                                    style={overstrspan !== "" ?{ marginRight: 60 }:null}>{getLabel("2097", "负责人") + "："}{hrmidspan}</span>
                                {overstrspan !== "" ?
                                    <span className="template-item-text t-t-overtime">{overstrspan}</span> : null}
                            </div>
                        </div>
                        <div className="t-t-task-rate">
                            <div>
                                {childtaskspan}
                            </div>
                        </div>

                    </div>

                );
            },
        }],
    };
}

const getTaskListTemplate = () => {
    return {
        default: [{
            key: "col_1",
            render: (data) => {
                const { subjectspan, name, begindatespan, enddatespan, finish, overstrspan, hrmidspan, childtaskspan, finishcolorspan, islandmarkspan } = data;
                return (
                    <div className="template-list-wrapper">
                        <div className="t-t-circle-box-fly">
                            <Circle
                                current={parseFloat(finish || 0) / 100}
                                progressColor={finishcolorspan || "#009"}
                                startPoint={0}
                                size={49}
                                radius={22}
                                strokeWidth={5}
                                gradientDirection={"horizontal"}
                                linecap={"round"}
                            />
                        </div>
                        <div className="t-t-content-fly">
                            <div className="template-title">
                                <span dangerouslySetInnerHTML={{ __html: subjectspan }} />
                                {islandmarkspan === "1" ?
                                    <i className="flag-tags-icon icon-proj icon-flag1196069easyiconnet" />
                                    : null
                                }
                            </div>
                            <div className="t-t-template-item">
                                <span className="template-item-text">{getLabel("28098", "项目名称") + "："}{name}</span>
                            </div>
                            <div className="t-t-template-item">
                                <span className="template-item-text">{getLabel("500805", "计划开始") + "/" + getLabel("24980", "结束日期") + "："}
                                    {begindatespan}&nbsp;{begindatespan && enddatespan ? <span>/</span> : null}&nbsp;{enddatespan}
                                </span>
                            </div>
                            <div className="t-t-template-item">
                                <span className="template-item-text"
                                   style={overstrspan !== "" ?{ marginRight: 60 }:null}>{getLabel("2097", "负责人") + "："}{hrmidspan}</span>
                                {overstrspan !== "" ?
                                    <span className="template-item-text t-t-overtime">{overstrspan}</span> : null}
                            </div>
                        </div>
                        <div className="t-t-task-rate">
                            <div>
                                {childtaskspan}
                            </div>
                        </div>

                    </div>

                );
            },
        }],
    };
}

const getTaskListTemplateWithoutMan = () => {
    return {
        default: [{
            key: "col_1",
            render: (data) => {
                const { subjectspan, name, begindatespan, enddatespan, finish, overstrspan, finishcolorspan, childtaskspan, actualbegindatespan, actualbegindate, islandmarkspan } = data;
                return (
                    <div className="template-list-wrapper">
                        <div className="t-t-circle-box-fly">
                            <Circle
                                current={parseFloat(finish || 0) / 100}
                                progressColor={finishcolorspan || "#009"}
                                startPoint={0}
                                size={49}
                                radius={22}
                                strokeWidth={5}
                                gradientDirection={"horizontal"}
                                linecap={"round"}
                            />
                        </div>
                        <div className="t-t-content-fly">
                            <div className="template-title">
                                <span dangerouslySetInnerHTML={{ __html: subjectspan }} />
                                {islandmarkspan === "1" ?
                                    <i className="flag-tags-icon icon-proj icon-flag1196069easyiconnet" />
                                    : null
                                }
                            </div>
                            <div className="t-t-template-item">
                                <span className="template-item-text">{getLabel("28098", "项目名称") + "："}{name} </span>
                            </div>
                            <div className="t-t-template-item">
                                <span className="template-item-text">{getLabel("500805", "计划开始") + "/" + getLabel("24980", "结束日期") + "："}{begindatespan}&nbsp;                                        {begindatespan && enddatespan ? <span>/</span> : null}&nbsp;
                                        {enddatespan}</span>
                            </div>
                            <div className="t-t-template-item">
                                <span
                                    className="template-item-text">{getLabel("24696", "实际开始日期") + "："}{actualbegindatespan || actualbegindate}</span>                            </div>
                            {overstrspan !== "" ? <div className="t-t-template-item">
                                <span className="template-item-text t-t-overtime">{overstrspan}</span>
                            </div> : null}
                        </div>
                        <div className="t-t-task-rate">
                            <div>
                                {childtaskspan}
                            </div>
                        </div>

                    </div>

                );
            },
        }],
    };
}

const getExchangeTemplate = (template, history) => {
    return {
        default: [{
            key: "col_1",
            render: (data) => {
                const { createdate, creater, createrspan, createrimg, createtime, name, remarkspan, remark, prjtaskid, type_n } = data;
                return (
                    <div className="template-list-wrapper">
                        <div className="template-avatar-box">
                            <Avatar className="template-avatar"
                                name={createrspan || creater}
                                url={createrimg} />
                        </div>
                        <div className="template-content">
                            <div className="active-content-head">
                                <div className="active-user-box">
                                    <span className="active-user-name">{createrspan || creater}</span>

                                    {getLabel("15153", "相关交流")}
                                    {/*<i className="active-tags-icon icon-proj icon-tags1"/>*/}
                                </div>
                                <div className="active-content-time">
                                    {createdate}&nbsp;&nbsp;{createtime}
                                </div>
                            </div>
                            {history ? <div className="active-content-proj">
                                <span onClick={(e) => {
                                    e && e.stopPropagation ? e.stopPropagation() : window.event.cancelBubble = true;
                                    if (type_n === "PP") {
                                        history.push(`/ProjectDetails/0/${prjtaskid}/view`)
                                    } else {
                                        history.push(`/TaskDetails/0/${prjtaskid}`)
                                    }
                                }}>

                                    {type_n === "PP" ? <span> #【{getLabel("101", "项目")}】</span> : <span> #【{getLabel("1332", "任务")}】</span>}
                                    {name}#
                                    </span>
                            </div> : null}
                            <div className="active-content-text">
                                <span dangerouslySetInnerHTML={{ __html: Base64.decode(remarkspan || remark) }} />
                            </div>
                        </div>
                    </div>
                );
            },
        }],
    };
}

const getDocumentTemplate = () => {
    return {
        default: [{
            key: "col_1",
            render: (data) => {
                const {
                    doccreatedatespan, doccreatedate, doccreatetimespan, doccreatetime, docextendtypespan, docextendtype,
                    docextendcolorspan, docextendcolor, docname, docnamespan, ownerid, owneridspan
                } = data;
                return (
                    <div className="template-list-wrapper">
                        <div className="template-avatar-box">
                            <Icon type={`${docextendtypespan || docextendtype}`} size="lg"
                                color={`${docextendcolorspan || docextendcolor}`} />
                        </div>
                        <div className="template-content">
                            <div className="doc-content-head">
                                {docnamespan || docname}
                            </div>
                            <div className="doc-content-text">
                                <span className="doc-content-text-left">{owneridspan || ownerid}</span>
                                <span>{doccreatedatespan || doccreatedate}&nbsp;{doccreatetimespan || doccreatetime}</span>
                            </div>
                        </div>
                    </div>
                );
            },
        }],
    };
}

const getWorkflowTemplate = () => {
    return {
        default: [{
            key: "col_1",
            render: (data) => {
                const {
                    createdatespan, createdate, createtimespan, createtime, createrspan, creater,
                    requestnamespan, requestname
                } = data;
                return (
                    <div className="template-list-wrapper">
                        <div className="template-content-no-img">
                            <div className="doc-content-head">
                                {requestnamespan || requestname}
                            </div>
                            <div className="doc-content-text">
                                <span className="doc-content-text-left">{createrspan || creater}</span>
                                <span>{createdatespan || createdate}&nbsp;{createtimespan || createtime}</span>
                            </div>
                        </div>
                    </div>
                );
            },
        }],
    };
}

const getPrjStateTemplate = () => {
    return {
        default: [{
            key: "col_1",
            render: (data) => {
                const { descriptionspan, description, namespan, name } = data;
                return (
                    <div className="template-list-wrapper">
                        <div className="template-content-no-img">
                            <div className="template-title">
                                <span className="template-item-text">{getLabel("500829", "阶段名称") + "："}{namespan || name}</span>                            </div>
                            <div className="t-t-template-item">
                                <span className="template-item-text">{getLabel("433", "描述") + "："}{descriptionspan || description}</span>                            </div>
                        </div>
                    </div>

                );
            },
        }],
    };
}
module.exports = {
    getTaskListTemplate,
    getPrjChildTaskListTemplate,
    getExchangeTemplate,
    getDocumentTemplate,
    getWorkflowTemplate,
    getPrjStateTemplate,
    getHomeTaskTemplate,
    getTaskListTemplateWithoutMan,
}
